<template>
  <div class="container">
    <h4>
      <span v-if="targetPath">编辑</span> 应用接入信息
    </h4>
    <el-form ref="form" :rules="rules" :model="form" label-width="220px">
      <el-form-item label="应用名称:">{{ $route.query.name }}</el-form-item>
      <el-form-item label="环境:">{{ env }}</el-form-item>
      <el-form-item label="目标文件:" prop="targetPath">
        <el-input v-model="form.targetPath" placeholder="目标文件" />
      </el-form-item>
      <el-form-item label="启动参数（-jar之前）:" prop="jvmOption">
        <el-input :autosize="{ minRows:4, maxRows:4}" v-model="form.jvmOption" type="textarea" placeholder="启动参数（-jar之前）" />
      </el-form-item>
      <el-form-item label="启动参数（-jar之后）:" prop="javaOption">
        <el-input :autosize="{ minRows:4, maxRows:4}" v-model="form.javaOption" type="textarea" placeholder="启动参数（-jar之后）" />
      </el-form-item>
      <el-form-item>
        <el-button :loading="execBtnLoading" type="primary" @click="onSubmit('form')">保存</el-button>
        <el-button @click="cancelFn">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import {
  create
} from '@/api/build/appconfig'
export default {
  name: 'Springboot',
  data() {
    return {
      form: {
        targetPath: '',
        jvmOption: '',
        javaOption: ''
      },
      env: '',
      execBtnLoading: false,
      rules: {
        targetPath: [{ required: true, message: '请输入目标文件', trigger: 'blur' }],
        jvmOption: [{ required: true, message: '请输入启动参数（.jar之前）', trigger: 'blur' }],
        javaOption: [{ required: true, message: '启动参数（.jar之后）', trigger: 'blur' }]
      }
    }
  },
  mounted() {
    const query = this.$route.query
    this.form.targetPath = query.targetPath
    this.env = query.env
    this.form.jvmOption = query.jvmOption
    this.form.javaOption = query.javaOption
    this.form.k8sFlag = query.k8sFlag
    if (this.form.targetPath) {
      this.form.flag = 1
    } else {
      this.form.flag = 0
    }

    this.form.envName = query.env
    this.form.appId = query.appId
  },
  methods: {
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.execBtnLoading = true
          create(this.form).then(res => {
            if (res.code === 1) {
              this.$notify({
                title: '成功',
                message: '保存成功',
                type: 'success',
                duration: 2000
              })
              this.$router.back()
            } else {
              this.$alert('提交失败', '提示', {
                confirmButtonText: '确定',
                callback: action => {
                }
              })
            }
            this.execBtnLoading = false
          })
        } else {
          this.$alert('提交失败', '提示', {
            confirmButtonText: '确定',
            callback: action => {
            }
          })
          return false
        }
      })
    },
    cancelFn() {
      this.$router.back()
    }
  }
}
</script>
<style lang="scss" scoped>
.el-form /deep/ .el-input {
  width: 300px;
}
</style>

